<!DOCTYPE html>
<!-- saved from url=(0097)https://storage.googleapis.com/supplemental_media/udacityu/2730818600/bootstrap-prestructure.html -->
<html>

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
  <link rel="stylesheet" href="../../bootstrap/css/bootstrap-theme.min.css">
  <link rel="stylesheet" href="../../bootstrap/css/bootstrap.min.css">
  <script src="../../bootstrap/js/jquery-3.4.1.min.js"></script>
  <script src="../../bootstrap/js/bootstrap.min.js"></script>
  <style>
  </style>
</head>

<body>
  <div class="container">
    <div class="row">
      <div class="col-md-6"><img src="./bootstrap-prestructure_files/100x100"></div>
      <div class="col-md-6  text-right text-uppercase">
        <h1>Jane Doette</h1>
        <h3>Front-end Ninja</h3>
      </div>
    </div>
    <div class="row">
      <div class="col-md-12">
        <img class="img-responsive" src="./bootstrap-prestructure_files/1140x350" data-toggle="modal"
          data-target="#project1">
      </div>
    </div>
    <div class="row">
      <div class="col-md-12">
        <h2>Featured Work</h2>
      </div>
    </div>

    <div class="row">
      <div class="col-md-6">
        <img src="./bootstrap-prestructure_files/555x300">
        <h3>Appify</h3>
        <p><a href="http://github.com/">Link to project</a></p>
      </div>
      <div class="col-md-6">
        <img src="./bootstrap-prestructure_files/555x300">
        <h3>Appify</h3>
        <p><a href="http://github.com/">Link to project</a></p>
      </div>
    </div>
    <div class="row">
      <div class="col-md-6">
        <img src="./bootstrap-prestructure_files/555x300">
        <h3>Appify</h3>
        <p><a href="http://github.com/">Link to project</a></p>
      </div>
      <div class="col-md-6">
        <img src="./bootstrap-prestructure_files/555x300">
        <h3>Appify</h3>
        <p><a href="http://github.com/">Link to project</a></p>
      </div>
    </div>
  </div>

  <!-- Modal -->
  <div class="modal fade" id="project1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header row">
          <div class="col-md-6">
            <h4 class="modal-title" id="myModalLabel">Favorite App Page</h4>
          </div>
          <div class="col-md-6 text-right">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
                aria-hidden="true">&times;</span></button>
          </div>
        </div>
        <div class="modal-body">
          <img class="img-responsive" src="./bootstrap-prestructure_files/1140x350">
          This was my first project in this class. I learned a lot about HTML and CSS.
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
      </div>
    </div>
  </div>
</body>

</html>